import Taro, { Component, setNavigationBarTitle } from '@tarojs/taro';
import { View, Text, Button } from '@tarojs/components';
import './index.scss';
import { articleDetail } from '../../../services/article';
import NavigationBar from '../../../components/navigationBar/index';
import { fullImgUrl, timeFormat } from '../../../utils/utils';
import { getcustomizepic, getCardInfo } from '../../../services/user';

export default class Index extends Component {

  config = {
    navigationBarTitleText: ''
  }

  state = {
    content: null,
    navigationBarHeight: Taro.getStorageSync('navigationBarHeight'),
    showBtn: false,
    userInfo: Taro.getStorageSync('userInfo'),
    din: Taro.getStorageSync('setting').customize_pic_button,
  }

  componentWillMount() {
    const { id, showBtn = 0 } = this.$router.params;
    if (Taro.getStorageSync('agent_id')) {
      getcustomizepic({
        agent_id: Taro.getStorageSync('agent_id'),
      }).then(res => {
        this.setState({
          Bg: res
        })
      })
      Taro.removeStorageSync('agent_id')
    } else {
      getcustomizepic({
        agent_id: Taro.getStorageSync('userInfo').id,
      }).then(res => {
        this.setState({
          Bg: res
        })
      })
    }
  }
  componentDidMount() { }
  componentWillReceiveProps(nextProps, nextContext) { }
  componentWillUnmount() { }
  componentDidShow() { }
  componentDidHide() { }
  componentDidCatchError() { }
  componentDidNotFound() { }

  callPhone() {
    Taro.makePhoneCall({
      phoneNumber: Taro.getStorageSync('setting').mobile
    })
  }
  scan = () => {

    // Taro.setStorageSync('card_no', '00200820000017192')
    // Taro.navigateTo({
    //   url: `/subPackageWork/pages/exchange/index?type=coupon`
    // })
    // return
    if (!this.state.userInfo) {
      Taro.navigateTo({
        url: '/subPackageWork/pages/login/index',
      });
    } else {
      let self = this;
      Taro.scanCode({
        onlyFromCamera: true,
        success(res) {
          if (res.result.slice(0, 2) === '00') {
            Taro.setStorageSync('card_no', res.result);
            Taro.navigateTo({
              url: `/subPackageWork/pages/exchange/index?type=coupon`,
            });
          } else {
            getCardInfo({
              card_no: res.result,
            }).then(data => {
              if (data.status === 6) {
                Taro.setStorageSync('card_no', data.card_no);
                if (data.user) {
                  Taro.setStorageSync('barcode_address', data.user.level_customize_pic);
                }
                Taro.setStorageSync('attr_name', data.attr_name);
                Taro.navigateTo({
                  url: `/subPackageWork/pages/exchange/index`,
                });
              } else if (data.status === 4) {
                addCard({
                  card_no: data.card_no,
                }).then(
                  res => {
                    Taro.showToast({
                      title: '添加成功',
                      icon: 'none',
                    });
                    // 二级代理从一级代理领卡
                    let contentArr = [
                      {
                        key: '卡号',
                        value: data.card_no,
                      },
                      {
                        key: '类型',
                        value: data.attr_name,
                      },
                    ];
                    self.setState({
                      contentArr: contentArr,
                      isShowModal: true,
                      cardInfo: data,
                      modalTitle: '已加入我的兑换卡',
                      comfirmText: '继续添加',
                      cancleText: '关闭',
                    });
                  },
                  () => {
                    this.setState({
                      isShowModal: false,
                    });
                  }
                );
              } else if (data.status === 5) {
                let contentArr = [
                  {
                    key: '卡号',
                    value: data.card_no,
                  },
                  {
                    key: '类型',
                    value: data.attr_name,
                  },
                ];
                self.setState({
                  contentArr: contentArr,
                  isShowModal: true,
                  cardInfo: data,
                  modalTitle: '兑换卡',
                  comfirmText: '去付款',
                  cancleText: '取消',
                });
              } else {
                // Taro.showToast({
                //   title: '卡的状态不对',
                //   icon: 'none'
                // })
              }
            });
          }
        },
      });
    }
  };
  render() {
    const { content, showBtn, Bg, din } = this.state;
    return (
      <View className="customized" style={`margin-top: ${navigationBarHeight}`}>
        <NavigationBar text='代理商定制' type="bindcard" />
        <Image className='bg' src={fullImgUrl(Bg)} />
        <Image className="btn-wrappers" src={fullImgUrl(din)} onClick={this.scan}>
        </Image>
      </View>
    );
  }
}
